<template>
  <div class="home-container">
    <el-card>
      <h1>欢迎回来！</h1>
      <p>当前登录用户: {{ userInfo.userName }}</p>
      <p>用户类型: {{ userTypeText }}</p>
      <el-button type="danger" @click="handleLogout">退出登录</el-button>
    </el-card>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import auth from '../utils/auth'
import userApi from '../api/user'
import { ElMessage } from 'element-plus'

const router = useRouter()
const userInfo = ref({})
const userTypeText = ref('')

onMounted(() => {
  // 获取用户信息
  userInfo.value = auth.getUserInfo() || {}

  // 转换用户类型为文本
  if(userInfo.value.userType === 0){
    userTypeText.value = '管理员'
  }
  if(userInfo.value.userType === 1){
    userTypeText.value = '老师'
  }
  if(userInfo.value.userType === 2){
    userTypeText.value = '学生'
  }

})



// 退出登录
const handleLogout = () => {
  auth.removeToken()
  router.push('/login')
  ElMessage.success('已退出登录')
}
</script>

<style scoped>
.home-container {
  padding: 20px;
}
</style>